<template>
  <div>
    <GoodList :goods="pop.list"></GoodList>
    <van-button class="btn" type="primary" @click="btnClick"
      >点击加载下一页</van-button
    >
  </div>
</template>

<script>
import GoodList from '../../../components/goods/GoodList.vue'
export default {
  data() {
    return {
      pop: { list: [], page: 0 }
    }
  },
  created() {
    this.goodsReq('pop')
  },
  methods: {
    goodsReq() {
      const page = this.pop.page + 1
      this.$axios.get('/home/data?type=pop&page=' + page).then((res) => {
        this.pop.list.push(...res.data.data.list)
        this.pop.page += 1
      })
    },
    btnClick() {
      this.goodsReq('pop')
    }
  },
  components: {
    GoodList
  }
}
</script>

<style>
.btn {
  margin-left: 150px;
  margin-top: 30px;
  margin-bottom: 100px;
}
</style>
